/**
 * Model
 */

 import consts from "../../../../../consts/consts";
 import storage from "../../../../../utils/storage";
 import Header from "../Header";
 import React,{Component} from "react";

 class Model extends Component{
    handleOnChangeModel(){
        const {data} = this.props;
//        storage.data.is_edit_u3d = true;
//        
//        var root = this.props.root;
//        root.openDialog(consts.WIDGET_TYPE.THREED);
        console.log("open dialog");
    }
    render(){
        const {type,data,selectedWidgetId,updateWidget,setState,selectContents} = this.props;
        let focus = (data.widget_id == selectedWidgetId);
        return (
            <div ref="content" className={"content-item " + (focus ? "focus " : " ") + (data.visible ? "unfold " : "fold ")} onClick={() => selectContents(data)}>
                <Header type={type} data={data} updateWidget={updateWidget} setState={setState} />
                <div className="content">
                    <div className="model-container">
                        <div className="left model-icon">
                            <i></i>
                        </div>
                        <div className="right">
                            <div className="msg-container">
                                <p>{data.msg1}</p>
                                <p>{data.msg2}</p>
                            </div>
                        </div>
                    </div>
                    <button onClick={() => this.handleOnChangeModel()}>{$._("Replace")}{$._("3D Model")}</button>
                </div>
            </div>
        )
    }
 }

 module.exports = Model;
